// Zepto
var $ = require('./components/zepto/zepto');
require('./components/zepto/event');
require('./components/zepto/ajax');
require('./components/zepto/form');
require('./components/zepto/ie');
require('./components/zepto/touch');

module.exports = $;

var Swiper = require('./components/swiper/swiper.min');
var swiperAnimate = require('./components/swiper/swiper.animate1.0.2.min');
var IScroll = require('./components/iscroll/iscroll');
//var demoUtils = require('./components/iscroll/demoUtils');
function isPassive() {
    var supportsPassiveOption = false;
    try {
        addEventListener("test", null, Object.defineProperty({}, 'passive', {
            get: function() {
                supportsPassiveOption = true;
            }
        }));
    } catch (e) {}
    return supportsPassiveOption;
}



var myScroll;

function loaded() {
    myScroll = new IScroll('#wrapper', { useTransition: false });
}
loaded();

document.addEventListener('touchmove', function(e) { e.preventDefault(); }, isPassive() ? {
    capture: false,
    passive: false
} : false);





$('#footer li').on('tap', function() {
    var apiTarget = $(this).attr('id');
    var apiUrl = "http://localhost:8000/api/" + apiTarget + ".php";
    $(this).find('i,span').addClass('active');
    $(this).siblings().find('i,span').removeClass('active');
    $('#header').html(apiTarget);
    $.ajax({
        type: "get",
        url: apiUrl,
        dataType: 'json',
        async: true,
        success: function(data) {
            //console.log(data.length)
            var html = '';
            for (var i = 0; i < data.length; i++) {
                html += '<li>';
                html += '<div class="img">';
                html += '<img src="./images/' + data[i].image + '.png" alt="">';
                html += '</div>';
                html += '<div class="ppt">';
                html += '<h3>' + data[i].category + '</h3>';
                html += '<div class="sk-text">' + data[i].name + '</div>';
                html += '<div class="sk-level">' + data[i].level + '</div>';
                html += '</div>';
                html += '</li>';
            }
            $("#scroller ul").html(html);
        }
    });
});

$.ajax({
    type: "get",
    url: "http://localhost:8000/api/skill.php",
    dataType: 'json',
    async: true,
    success: function(data) {
        var html = '';
        for (var i = 0; i < data.length; i++) {
            html += '<li>';
            html += '<div class="img">';
            html += '<img src="./images/' + data[i].image + '.png" alt="">';
            html += '</div>';
            html += '<div class="ppt">';
            html += '<h3>' + data[i].category + '</h3>';
            html += '<div class="sk-text">' + data[i].name + '</div>';
            html += '<div class="sk-level">' + data[i].level + '</div>';
            html += '</div>';
            html += '</li>';
        }
        $("#scroller ul").html(html);
    }
});


//swiper
var swiper = new Swiper('.swiper-container', {
    pagination: '.swiper-pagination',
    paginationClickable: true,
    onInit: function(swiper) { //Swiper2.x的初始化是onFirstInit
        swiperAnimate.swiperAnimateCache(swiper); //隐藏动画元素 
        swiperAnimate.swiperAnimate(swiper); //初始化完成开始动画
    },
    onSlideChangeEnd: function(swiper) {
        swiperAnimate.swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
    }
});



$('.mainIscroll').hide();
$('#enterBtn').on('tap', function() {
    $('.swiper-container').hide();
    $('.mainIscroll').show();
})



var interval = setInterval(function() {
    if (document.readyState === 'complete') {
        clearInterval(interval);
        $("#loading").hide();
        $(".swiper-container").show();
        swiper.updateContainerSize(); // 万分重要
        swiper.updateSlidesSize(); // 万分重要
    } else {
        $("#loading").show();
    }
})